<template>
  <div class="content">
    <div class="price"><span>￥</span><span class="price-item">{{content.price}}</span></div>
    <div class="title">
     <img src="../../../assets/img/Mall/icon/商品.svg" alt="">
     <div>:{{content.goodname}}</div>
    </div>
    <div class="desc">
     <img src="../../../assets/img/Mall/icon/描述.svg" alt="">
     <div>:{{content.goodinfo}}</div>
    </div>
    <div class="address">
     <img src="../../../assets/img/Mall/icon/地址.svg" alt="">
     <div>:{{content.address}}</div>
    </div>
  </div>
</template>

<script>

export default {
  name: '',
  props:{
   content:{
    type:Object,
    default(){
     return {}
    }
   }
  },
  data () {
    return {
      
    }
  },
  mounted(){
    // console.log(this.content)
  },
  methods:{
  
}
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.content{
 padding: 10px 5px;
}
.content div{
 padding: 10px 5px;
}
.price{
 background-color: #eee;
}
.price span{
 color: orangered;
}
.price-item{
  font-size: 20px;
}
.title,.desc,.address{
  display: flex;
}
</style>
